
var statusChartData=[
    {
        name:'shaojie',
        series:[
            {name:'烧结预测',type:'line',lineStyle:'dotted',color:'#00ccfe'},
            {name:'烧结历史',type:'line',lineStyle:'solid',color:'#00ccfe'}
        ]
    },
    {
        name:'shihuiyao',
        series:[
            {name:'石灰窑预测',type:'line',lineStyle:'dotted',color:'#00ccfe'},
            {name:'石灰窑历史',type:'line',lineStyle:'solid',color:'#00ccfe'}
        ]
    },
    {
        name:'penmei',
        series:[
            {name:'喷煤预测',type:'line',lineStyle:'dotted',color:'#00ccfe'},
            {name:'喷煤历史',type:'line',lineStyle:'solid',color:'#00ccfe'}
        ]
    },
    {
        name:'qiutuan',
        series:[
            {name:'球团预测',type:'line',lineStyle:'dotted',color:'#00ccfe'},
            {name:'球团历史',type:'line',lineStyle:'solid',color:'#00ccfe'}
        ]
    },
    {
        name:'zhutieliangang',
        series:[
            {name:'铸铁炼钢预测',type:'line',lineStyle:'dotted',color:'#00ccfe'},
            {name:'铸铁炼钢历史',type:'line',lineStyle:'solid',color:'#00ccfe'}
        ]
    }

];
var  gasOption=[
    {
        tooltip:{
            show:true,
            formatter:function(params){
                var nameArr = [];
                var valueArr = [];
                var str = '';
                for(var i=0;i<params.length;i++){
                    nameArr[i]=params[i].seriesName;
                    valueArr[i]=Number(params[i].data).toFixed(1);

                    str+= nameArr[i]+' : '+valueArr[i]+'<br/>'
                }
                return str
            }
        },
        grid:{
            left:30,
            top:60,
            right:30,
            bottom:30
        },
        yAxis:{
            name:'X10³',
            axisLabel:{
                formatter:function (value, index) {
                    return Number(value)/Math.pow(10,3).toFixed(1);
                }
            }
        }
    },
    {
        tooltip:{
            show:true,
            formatter:function(params){
                var nameArr = [];
                var valueArr = [];
                var str = '';
                for(var i=0;i<params.length;i++){
                    nameArr[i]=params[i].seriesName;
                    valueArr[i]=Number(params[i].data).toFixed(1);

                    str+= nameArr[i]+' : '+valueArr[i]+'<br/>'
                }
                return str
            }
        },
        grid:{
            left:30,
            top:60,
            right:30,
            bottom:30
        },
        yAxis:{
            name:'X10³',
            axisLabel:{
                formatter:function (value, index) {
                    return Number(value)/Math.pow(10,3).toFixed(1);
                }
            }
        }
    },
    {
        tooltip:{
            show:true,
            formatter:function(params){
                var nameArr = [];
                var valueArr = [];
                var str = '';
                for(var i=0;i<params.length;i++){
                    nameArr[i]=params[i].seriesName;
                    valueArr[i]=Number(params[i].data).toFixed(1);

                    str+= nameArr[i]+' : '+valueArr[i]+'<br/>'
                }
                return str
            }
        },
        grid:{
            left:30,
            top:60,
            right:30,
            bottom:30
        },
        yAxis:{
            name:'X10³',
            axisLabel:{
                formatter:function (value, index) {
                    return Number(value)/Math.pow(10,3).toFixed(1);
                }
            }
        }
    },
    {
        tooltip:{
            show:true,
            formatter:function(params){
                var nameArr = [];
                var valueArr = [];
                var str = '';
                for(var i=0;i<params.length;i++){
                    nameArr[i]=params[i].seriesName;
                    valueArr[i]=Number(params[i].data).toFixed(1);

                    str+= nameArr[i]+' : '+valueArr[i]+'<br/>'
                }
                return str
            }
        },
        grid:{
            left:30,
            top:60,
            right:30,
            bottom:30
        },
        yAxis:{
            name:'X10³',
            axisLabel:{
                formatter:function (value, index) {
                    return Number(value)/Math.pow(10,3).toFixed(1);
                }
            }
        }
    },
    {
        tooltip:{
            show:true,
            formatter:function(params){
                var nameArr = [];
                var valueArr = [];
                var str = '';
                for(var i=0;i<params.length;i++){
                    nameArr[i]=params[i].seriesName;
                    valueArr[i]=Number(params[i].data).toFixed(1);

                    str+= nameArr[i]+' : '+valueArr[i]+'<br/>'
                }
                return str
            }
        },
        grid:{
            left:30,
            top:60,
            right:30,
            bottom:30
        },
        yAxis:{
            name:'X10³',
            axisLabel:{
                formatter:function (value, index) {
                    return Number(value)/Math.pow(10,3).toFixed(1);
                }
            }
        }
    }
];
var APP = new Vue({
    el:'#app',
    data:{
        classlist:['main-item-gaolu','main-item-refenglu','main-item-zhagang','main-item-others','main-item-guolu'],
        statusChartId:['chart_'+uuid(8,64),'chart_'+uuid(8,64),'chart_'+uuid(8,64),'chart_'+uuid(8,64),'chart_'+uuid(8,64)],
        nameList:['烧结','石灰窑','喷煤','球团','铸铁炼钢'],
        statusChart:[],
        statusObj:{},
        historyData:{},
        PressureData:{},
        predictionData:{},
        gasData:{},
        gasArr:['shaojie','shihuiyao','penmei','qiutuan','zhutieliangang'],
        msgCenter:[],
        srcline:'history.html'
    },
    filters:{
        formatterVal:function(val){
            return val/Math.pow(10,3);
        },
        keepInteger:function(val){
            return Math.floor(val);
        },
        keepOne:function(val){
            return val.toFixed(1);
        },
        orNaN:function(val){
            if(isNaN(val)==true){
                return '0.0'
            }else{
                return val
            }
        },
    },
    mounted:function(){

        this.$nextTick(function(){
            var _this = this;
            this.getPressureData().then(function (){
                setTimeout(function(){
                    _this.instatusChart();
                    _this.loadStatusChartHistoryData();
                    _this.loadStatusChartRealData();
                    _this.waveChart();
                },1000);
                setInterval(function(){
                    _this.loadStatusChartRealData();
                    _this.getPressureData();
                    _this.waveChart();
                    _this.getMsgCenter();
                },3000)
            });
        })
    },
    methods:{
        instatusChart:function(){
            var _this = this;
            this.statusChartId.forEach(function(item,index){
                var _index = index;
                _this.statusChart[index]= new Chart(item,{
                    data:statusChartData[_index].series,
                    baseOption:gasOption[_index],
                })
            });
            //console.log(this.statusObj)
        },
        getSeriesName:function(progress,type){
            var seriesName='';
            if(type=='history' || type=='realPoint'){
                switch(progress){
                    case 'shaojie':
                        seriesName='烧结历史';
                        break;
                    case 'shihuiyao':
                        seriesName='石灰窑历史';
                        break;
                    case 'penmei':
                        seriesName='喷煤历史';
                        break;
                    case 'qiutuan':
                        seriesName='球团历史';
                        break;
                    case 'zhutieliangang':
                        seriesName='铸铁炼钢历史';
                        break;
                }
            }else if(type=='prediction'){
                switch(progress){
                    case 'shaojie':
                        seriesName='烧结预测';
                        break;
                    case 'shihuiyao':
                        seriesName='石灰窑预测';
                        break;
                    case 'penmei':
                        seriesName='喷煤预测';
                        break;
                    case 'qiutuan':
                        seriesName='球团预测';
                        break;
                    case 'zhutieliangang':
                        seriesName='铸铁炼钢预测';
                        break;
                }
            }

            return seriesName;
        },
        getStatusChartData:function(progress,type,index){
            var success = function (res) {
                var _this= this;
                var data = res.data;
                var seriesName =_this.getSeriesName(progress,type);
                var axis = getAxis(data);
                if(type=='prediction'){
                    if(axis.dataX.length==0) return;
                    //var predictData = axis.dataX;
                    _this.statusChart[index].loadX(axis.dataX);
                    switch (progress){
                        case 'shaojie':
                            _this.gasData.shaojie=Number(data[data.length-1][1]);
                            break;
                        case 'shihuiyao':
                            _this.gasData.shihuiyao=Number(data[data.length-1][1]);
                            break;
                        case 'penmei':
                            _this.gasData.penmei=Number(data[data.length-1][1]);
                            break;
                        case 'qiutuan':
                            _this.gasData.qiutuan=Number(data[data.length-1][1]);
                            break;
                        case 'zhutieliangang':
                            _this.gasData.zhutieliangang=Number(data[data.length-1][1]);
                            break;
                    }
                }
                if(type=='history'){
                    _this.historyData[progress+'_'+type]=data;
                    /*if(predictData==undefined){
                        _this.statusChart[index].loadX(axis.dataX)
                    }*/
                }
                if(type=='baseLine'){
                    if(data.length==0) return;//调代码
                    _this.statusChart[index].loadBaseLine(seriesName,{
                        data:data
                    })
                }
                if(type=='realPoint'){
                    if(!_this.historyData[progress+'_history']) return;
                    _this.historyData[progress+'_history'].push(data);
                    _this.historyData[progress+'_history'].shift();
                    axisreal = getAxis(_this.historyData[progress+'_history']);
                    // _this.statusChart[index].loadX(axisreal.dataX);
                    _this.statusChart[index].loadData(seriesName,axisreal.dataY)
                }else{
                    _this.statusChart[index].loadData(seriesName,axis.dataY)
                }
            };
            var error = function(e){
                console.log('加载'+type+'图表出错了')
            };
            this.$http.get(URL+'/other/'+progress+'/'+type).then(success,error);
        },
        loadStatusChartHistoryData:function(){
            for(var i=0;i<statusChartData.length;i++){
                var name=statusChartData[i].name;
                this.getStatusChartData(name,'history',i);
                this.getStatusChartData(name,'baseLine',i);
            }
        },
        loadStatusChartRealData:function(){
            for(var i=0;i<statusChartData.length;i++){
                var name=statusChartData[i].name;
                this.getStatusChartData(name,'prediction',i);
                this.getStatusChartData(name,'realPoint',i);
            }
        },
        getPressureData:function(){
            var _this = this;
            var success = function(res){
                _this.PressureData=res.data;
            };
            var error = function(e){
                console.log('加载压力出错')
            }
            return this.$http.get(URL+'/other/equipment/status').then(success,error)
        },
        waveChart:function(){
            /*波动归因*/
            Chart3('gas_chart',URL+'/coalgas/other/bodongguiyin');
        },
        /*消息中心*/
        getMsgCenter:function(){
            var _this=this;
            bus.$on('msgType',function(val){
                _this.msgType=val;
            });
            var success=function(res){
                _this.msgCenter=res.data;
            };
            var error=function(e){
                console.log('全网消息中心出错了');
            };
            this.$http(URL+'/message/current').then(success,error);
        }
    }
});
